<template>
  <view class="pa-3">
    <nut-addresslist
      v-if="data"
      :data="data"
      :show-bottom-button="true"
      :data-map-options="dataMapOptions"
      @handelDelIcon="delClick"
      @swipeDelClick="delClick"
      @handelEditIcon="itemClick"
      @addAddressClick="Taro.navigateTo({ url: '/pages/user/address/detail/index' })"
    >
    </nut-addresslist>
    <nut-empty v-else description="您还没有地址信息">
      <nut-button
        class="full-width mt-10"
        type="primary"
        @click="Taro.navigateTo({ url: '/pages/user/address/detail/index' })"
        >添加地址</nut-button
      >
    </nut-empty>
  </view>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import Taro, { useLoad } from '@tarojs/taro';
import { delAddressApi, getUserAddressListApi } from '@/api/user';

const data = ref([]);

const address = ref({
  province: [],
  city: [],
  country: [],
  town: [],
});

const dataMapOptions = ref({
  id: 'id',
  addressDetail: 'detail',
  addressName: 'address_name',
  fullAddress: 'full_address',
  defaultAddress: 'is_default',
});
const itemClick = (item) => {
  Taro.navigateTo({ url: `/pages/user/address/detail/index?id=${item.id}` });
};
const delClick = (e, item) => {
  Taro.showModal({
    title: '删除地址',
    content: `即将删除"${item.fullAddress}"，请确认`,
    confirmText: '确认删除',
    cancelText: '我再看看',
    success: (result) => {
      if (result.confirm) {
        delAddressApi({ id: item.id }).then((res) => {
          if (res.success) {
            Taro.showModal({ title: '删除成功' });
          }
        });
      }
    },
  });
};
const text = ref('请选择地址');
const getUserAddressList = () => {
  getUserAddressListApi({}).then((res) => {
    data.value = res.result;
  });
};

useLoad(() => {
  getUserAddressList();
});
</script>

<style lang="less" scoped></style>
